<template>
	<view>
		<view class="page">
			<view class="page-index">
				工程维护
			</view>
			<view>
				<view class="engineering-choose">
					<navigator class="engchoose-container" url="../project-maintenance/maintenance-manage/maintenance-manage-list">
						<view class="container-c">
							<view class="eng-pic">
								<image src="../../static/images/weixiuguanli.png" mode=""></image>
							</view>
							<view class="eng-words">维护管理</view>
						</view>
					</navigator>
					<navigator class="engchoose-container" url="../project-maintenance/malfunction-manage/malfunction-manage-list">
						<view class="container-c">
							<view class="eng-pic">
								<image src="../../static/images/guzhang.png" mode=""></image>
							</view>
							<view class="eng-words">故障管理</view>
						</view>
					</navigator>
					<navigator class="engchoose-container" url="../project-maintenance/alarm-manage/alarm-manage-list">
						<view class="container-c">
							<view class="eng-pic">
								<image src="../../static/images/baojing.png" mode=""></image>
							</view>
							<view class="eng-words">报警管理</view>
						</view>
					</navigator>
					<navigator class="engchoose-container" url="../project-maintenance/emergency-manage/emergency-manage-list">
						<view class="container-c">
							<view class="eng-pic">
								<image src="../../static/images/yingjiguanli.png" mode=""></image>
							</view>
							<view class="eng-words">应急管理</view>
						</view>
					</navigator>
					<navigator class="engchoose-container" url="../personal/hand/duty-schedule-list">
						<view class="container-c">
							<view class="eng-pic"><image src="../../static/images/zb.png" mode=""></image></view>
							<view class="eng-words">值班管理</view>
						</view>
					</navigator>
				</view>

				<!--引用公共组件首页数据统计组件-->
				<view>
					<uniModuleIndex :moduleDatas="moduleDatas" :type="type"></uniModuleIndex>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue';
	import uniIcon from '@/components/uni-icon/uni-icon.vue';
	//引用数据统计组件
	import uniModuleIndex from "@/components/uni-module-index/uni-module-index.vue"
	export default {
		components: {
			uniNavBar,
			uniIcon,
			uniModuleIndex
		},
		data() {
			return {
				type: "1",
				/**
				 * 统计数据集合
				 * */
				moduleDatas: [{
						"name": "未完成任务",
						"num": "10"
					},
					{
						"name": "已完成任务",
						"num": "2"
					},
					{
						"name": "未处理故障",
						"num": "1"
					},
					{
						"name": "已处理故障",
						"num": "1"
					},
					{
						"name": "未处理报警",
						"num": "1"
					},
					{
						"name": "已处理报警",
						"num": "1"
					},
					{
						"name": "未结束事件",
						"num": "1"
					},
					{
						"name": "已结束事件",
						"num": "1"
					}
				]
			};
		},
		methods: {
			getDataList() {
				this.$api.StaticAanalysis.GetEngineeringMaintenance().then(res => {
						// console.log("数据信息" + JSON.stringify(res));
						this.moduleDatas = res[1].data.result;
					})
					.catch(res => {
						uni.showToast({
							title: '处理对象获取失败',
							duration: 2000
						});
					});
			}
		},
		onLoad: async function() {
			await this.getDataList();
		}

	};
</script>

<style>
	.page {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		position: absolute;
		background-color: #f2f2f2;
		box-sizing: border-box;
	}
	.page-index{
		width: 100%;
		height: 44px;
		background-color: #003466;
		padding-top: 30px;
		font-size: 20px;
		color: #FFFFFF;
		line-height: 44px;
		text-align: center;
	}

	.engineering-choose {
		width: 94%;
		background-color: #ffffff;
		border-radius: 3px;
		margin: 0 auto;
		margin-top: 15px;
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		padding-top: 14px;
		padding-bottom: 14px;
	}

	.engineering-choose .engchoose-container {
		width: 25%;
		height: 100%;
		display: flex;
		justify-content: center;
	}

	.container-c {
		width: 60px;
		height: 100%;
	}

	.eng-pic {
		width: 60px;
		height: 60px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 5px;
	}

	.eng-pic image {
		max-width: 70%;
		max-height: 70%;
	}

	.eng-words {
		color: #555555;
		font-size: 15px;
		text-align: center;
	}

	/*.mmisson-fire {
		width: 94%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	 .misson-option {
		width: 49%;
		height: 130px;
		background-color: #ffffff;
		border-radius: 3px;
		margin-top: 14px;
		position: relative;
	}

	.option-center {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
	}

	.cen_png {
		width: 100%;
		height: 30px;
		display: flex;
		justify-content: center;
		margin-top: 28px;
	}

	.option-png {
		width: 33px;
		height: 34px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.option-png image {
		max-width: 100%;
		max-height: 100%;
	}

	.optin-words {
		width: 100%;
		color: #666666;
		text-align: center;
		font-size: 15px;
		margin-top: 7px;
	}

	.optin-smallword {
		width: 100%;
		text-align: center;
		font-size: 16px;
		color: #84bff8;
	} */
</style>
